<template>
    <div>
        <el-button type="primary" @click="clickOpenDialog">编辑</el-button>
        <!-- 使用v-model语法简化双向绑定 -->
        <VideoDialog 
            v-model:dialogVisible="videoDialogVisible" 
            @dialog-close="handleDialogClose"
            :dataSrc="dataSrc"
        />
    </div>
</template>

<script setup lang="ts">
import VideoDialog from './VideoDialog.vue';
import { ref } from 'vue';
import dataSrc from '@/assets/video/985da951e55021c22a4048a3a5769d84.mp4'

const videoDialogVisible = ref(false)

function clickOpenDialog(){
    videoDialogVisible.value = true
}

// 对话框关闭时的额外处理
function handleDialogClose(){
    // 这里可以添加对话框关闭后的其他逻辑
    console.log('视频对话框已关闭')
}
</script>

<style lang="scss" scoped>
</style>